<!--
 * @Author: Mark
 * @Date: 2019-02-11 11:52:54
 * @LastEditors: Mark
 * @LastEditTime: 2019-02-11 15:29:55
 * @Description: 账单记录主页
 -->
<template>
  <div>
    <my-header></my-header>
    <div style="width:95%;margin:0 auto;margin-top: 20px">
      <el-tabs class="el-col el-col-24"
        type="border-card"
        v-model="activeName"
        @tab-click="handleClick"
      >
        <!-- 账单管理Tab -->
        <el-tab-pane
          label="账单管理"
          name="first"
        >
          <account></account>
        </el-tab-pane>

        <!-- 加工零件管理Tab -->
        <el-tab-pane
          label="零件管理"
          name="second"
        >
          <goods></goods>
        </el-tab-pane>

        <!-- 加工零件种类管理Tab -->
        <el-tab-pane
          label="零件种类管理"
          name="third"
        >
          <goods-cate></goods-cate>
        </el-tab-pane>

      </el-tabs>
    </div>

  </div>
</template>

<script>
import MyHeader from "@/components/Header";
import Account from "@/modules/bill/Account";
import Goods from "@/modules/bill/Goods";
import GoodsCate from "@/modules/bill/GoodsCategory";
export default {
  data() {
    return {
      activeName: "first"
    };
  },

  components: {
    Account,
    Goods,
    GoodsCate,
    MyHeader
  },

  methods: {
    handleClick(tab, event) {
      console.log(tab, event);
    }
  }
};
</script>
<style lang='scss' scoped>

</style>